<template>
  <!-- 检查合格(合格)--PDF页面 -->
  <div class="inspectPdf">
    <div class="pdf-btn" @click="htmlToPdf">下载</div>
    <div class="back-btn" @click="$router.back()">返回</div>

    <div class="matterList page">
      <div class="right-title">{{ policeCheckTaskInfo.policeAgencyName }}</div>

      <div class="recordTable">
        <div class="nameTitle">{{ policeCheckTaskInfo.companyMessageName }}检查记录单</div>
        <div class="details-table detailModal">
          <div class="common-titlepdf">
            <div class="icon"></div>
            <div class="content">企业信息</div>
          </div>
          <div class="stepTable">
            <div class="actualUnitDetails">
              <div class="companyinfo">
                <table>
                  <tr>
                    <td class="td_title" colspan="1">单位名称</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.companyMessageName || '暂无' }}</td>
                    <td class="td_title" colspan="1">所属行业</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.industryInformationName || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">统一社会信用代码</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.companyCreditCode || '暂无' }}</td>
                    <td class="td_title" colspan="1">责任民警</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.companyPoliceUserName || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">企业法人</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.companyLegalPersonName || '暂无' }}</td>
                    <td class="td_title" colspan="1">法人联系方式</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.companyLegalMobile || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">营业地址</td>
                    <td class="padNone" colspan="5">{{ policeCheckTaskInfo.companyAddressDetail || '暂无' }}</td>
                  </tr>
                </table>
              </div>
            </div>
          </div>

          <div class="common-titlepdf">
            <div class="icon"></div>
            <div class="content">检查信息</div>
          </div>
          <div class="stepTable">
            <div class="actualUnitDetails">
              <div class="companyinfo">
                <table>
                  <tr>
                    <td class="td_title" colspan="1">检查民警</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.policeUserName || '暂无' }}</td>
                    <td class="td_title" rowspan="5" colspan="1">民警签到图</td>
                    <td rowspan="5" width="340">
                      <img :src="`${imgPrefix + policeCheckTaskInfo.signPicture}`" alt="" class="signImage cusImg" />
                    </td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">警号</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.policeUserNo || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">检查类型</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.industryExamineName || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">检查/复查</td>
                    <td class="padNone" colspan="1">
                      {{ policeCheckTaskInfo.checkType == 1 ? '检查' : '复查' || '暂无' }}
                    </td>
                  </tr>
                  <tr>
                    <td class="td_title" colspan="1">检查时间</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.checkTime || '暂无' }}</td>
                  </tr>
                  <tr>
                    <td class="td_title" rowspan="1" colspan="1">检查结果</td>
                    <td class="padNone" colspan="1">{{ policeCheckTaskInfo.checkResult || '暂无' }}</td>
                    <td class="td_title" rowspan="1" colspan="1">责任人签名</td>
                    <td colspan="1" width="340">
                      <img :src="`${imgPrefix + policeCheckTaskInfo.principalSignatureUrl}`" alt="" class="dutyImage" />
                    </td>
                  </tr>
                </table>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { checkTaskRecord } from '@/api/goover'
import { findEnableDictItemsbyCode } from '@/api/api'
import { addHtmlStyleProps, removeHtmlStyleProps } from '../../../utils/util'

export default {
  name: 'qualifiedPdf',
  data() {
    return {
      imgPrefix: '',
      policeCheckTaskInfo: {},
      params: {},
    }
  },
  created() {
    this.getImagePrefix()
  },
  mounted() {
    addHtmlStyleProps()
    document.getElementsByClassName('ant-layout-header')[0].style.display = 'none'
    if (document.getElementsByClassName('ant-layout-footer')[0]) {
      document.getElementsByClassName('ant-layout-footer')[0].style.display = 'none'
    }
    this.getDetailList()
  },
  methods: {
    htmlToPdf() {
      document.head.getElementsByTagName('title')[0].innerText =
        this.policeCheckTaskInfo.companyMessageName + '检查记录单'
      window.print()
    },
    getDetailList() {
      this.params = JSON.parse(localStorage.getItem('detailsGooverData'))
      checkTaskRecord({ taskId: this.params.id }).then((res) => {
        let { policeCheckTaskInfo } = res.result
        this.policeCheckTaskInfo = policeCheckTaskInfo
      })
    },
    getImagePrefix() {
      findEnableDictItemsbyCode({ code: 'static_server' }).then((res) => {
        this.imgPrefix = res.result[0].value
      })
    },
  },
  destroyed() {
    removeHtmlStyleProps()

    document.getElementsByClassName('ant-layout-header')[0].style.display = 'block'
    document.getElementsByClassName('ant-layout-footer')[0].style.display = 'block'
  },
}
</script>

<style scoped lang="less">
.inspectPdf {
  .cusImg {
    object-fit: cover;
  }
}
</style>
